//爆料页面渲染
var voteTpl = {};
var coverItem = '<div class="cover"><span class="play-icon"></span><span class="checkbox-icon"></span></div>';

/**
 * [tpl2 模板2]
 */
voteTpl.mainHtml = template.compile(
    '	<div id="main" style="background-image:url({{data.details.background_img}});">' +
    '		<div class="ui-whitespace header">' +
    '			<h1 class="center ">{{data.details.title}}</h1>' +
    '			<div class="mt25">' +
    '				<span class="hTitle">' +
    '					投票时间:' +
    '				</span>' +
    '				<span id="voteTime">' +
    '					{{data.details.duration}}' +
    '				</span>	' +
    '			</div>' +
    '			<div class="flex rule">' +
    '				<span class="hTitle">' +
    '					活动规则:' +
    '				</span>' +
    '				<div id="rules"></div>' +
    '			</div>' +
    '		</div>' +
    '		<div class="ui-whitespace">' +
    '			<ul class="ui-row-flex voteTab mt25">' +
    '			    <li class="ui-col ui-flex ui-flex-pack-center cur"><div>投票</div></li>' +
    '			    <li class="ui-col ui-flex ui-flex-pack-center"><div>搜索</div></li>' +
    '			    <li class="ui-col ui-flex ui-flex-pack-center"><div>排行</div></li>' +
    '			</ul>' +
    '			<!-- 投票  S-->' +
    '			<div class="tabList index">' +
    '{{if data.details.categories.length>0}}' +
    '{{each data.details.dealItems as val1 i}}' +
    '				<div class="voteList voteListVideo mt30">' +
    '					<h3>{{val1.group_name}} <span style="display:none">Video</span></h3>' +
    '					<div>' +
    '						<ul class="ui-justify  voteListCon  mt20">' +
    '							<!-- 如果有背景图片请在下面的.production 元素上加上hasImg类 ' +
    '								 用于视频和音频' +
    '								 以便和没有图是显示不同的播放按钮图标' +
    '							-->' +
    '{{each val1.data as val2 j}}' +
    '						    <li class="ui-col-30">' +
    '						    	<div class="production voteBtnItem hasImg {{val2.type | voteType}}" voteId = "{{val2.id}}" voteType="{{val2.type}}" style="background-image:url({{val2.cover}});"> '+coverItem+'</div>' +
    '						    	<p class="productionTitle">{{val2.code}}号: {{val2.name}}</p>' +
    '						    	<p class="voteNumWrap">票数<span class="voteNum" id="vote1_{{val2.id}}">{{data.votes[val2.id]||0}}</span></p>' +
    '{{if val2.type == 4}}' +
    '						    	 <a  href="{{val2.src}}">选择</a>' +
    '{{else}}' +
    '                               <a  href="javascript:void;" class="selectBtn" voteId = "{{val2.id}}" voteType="{{val2.type}}">选择</a>' +
    '{{/if}}' +
    '						    </li>' +

    '{{/each}}' +
    '{{if val1.data.length % 3 == 1 }}' +
    '<li class="ui-col-30"></li>' +
    '{{else if val1.data.length % 3 == 2 }}' +
    '<li class="ui-col-30"></li>' +
    '<li class="ui-col-30"></li>' +
    '{{/if}}' +
    '						</ul>' +
    '					</div>' +
    '				</div>' +
    '{{/each}}' +
    '{{else}}' +

    '				<div class="voteList voteListVideo mt30">' +
    '					<div>' +
    '						<ul class="ui-justify  voteListCon  mt20">' +
    '							<!-- 如果有背景图片请在下面的.production 元素上加上hasImg类 ' +
    '								 用于视频和音频' +
    '								 以便和没有图是显示不同的播放按钮图标' +
    '							-->' +
    '     {{each data.details.items as val1 i}}' +
    '						    <li class="ui-col-30">' +
    '						    	<div class="production voteBtnItem hasImg {{val1.type | voteType}} " voteId = "{{val1.id}}" voteType="{{val1.type}}" style="background-image:url({{val1.cover}});">'+coverItem+'</div>' +
    '						    	<p class="productionTitle">{{val1.code}}号: {{val1.name}}</p>' +
    '						    	<p class="voteNumWrap">票数<span class="voteNum" id="vote1_{{val1.id}}">{{data.votes[val1.id]||0}}</span></p>' +
    '{{if val1.type == 4}}' +
    '						    	 <a  href="{{val1.src}}">选择</a>' +
    '{{else}}' +
    '                               <a  href="javascript:;" class="selectBtn" voteId = "{{val1.id}}" voteType="{{val1.type}}">选择</a>' +
    '{{/if}}' +
    '						    </li>' +
    '{{/each}}' +
    '{{if data.details.items.length % 3 == 1 }}' +
    '<li class="ui-col-30"></li>' +
    '{{else if data.details.items.length % 3 == 2 }}' +
    '<li class="ui-col-30"></li>' +
    '<li class="ui-col-30"></li>' +
    '{{/if}}' +
    '						</ul>' +
    '					</div>' +
    '				</div>' +

    '{{/if}}' +
    '			</div><!-- 投票  E-->' +
    '			<!-- 排行  S-->' +
    '			<div class="tabList pb30" style="display:none;">' +
    '				<div class="search mt20">' +
    '				    <input type="text" class="searchInput" placeholder="请输入姓名/编号搜索">' +
    '					<span class="searchBtn disabled" id="searchBtn">搜索</span>' +
    '				</div>' +
    '				<ul class="ui-list ui-list-link" id="searchBox">' +

    '				</ul>' +
    '			</div><!-- 搜索  E-->' +
    '			<!-- 排行  S-->' +
    '			<div class="tabList pb30" style="display:none;" >' +
    '				<ul class="ui-list ui-list-link" id="rankBox">' +

    '				</ul>' +
    '			</div><!-- 排行  E-->' +
    '		</div>' +
    '       <footer class="voteBtn">投票</footer>'+
    '	</div>');

voteTpl.rank = template.compile(
    '{{each data.items as val i}}' +
    '				    <li class="voteBtnItem" voteId = "{{val.id}}" voteType="{{val.type}}">' +
    // '				        <h4 class="ui-nowrap">{{val.name}}</h4>' +
    '				        <div class="ui-list-img {{val.cover | hasImg}} {{val.type | voteType}}" style="background-image:url({{val.cover}});">' +
    '							<i class="{{i==0 ? "jin" : i==1 ? "yin" : i==2 ? "tong" : ""}}"></i>' +
    '				        </div>' +
    '				        <div class="ui-list-info">' +
    '				        <h4 class="ui-nowrap">{{val.code}}号: {{val.name}}</h4>' +
    // '				            <p class="ui-nowrap-multi">{{#val.content}}</p>' +
    '				            <div class="state">' +
    '				            	<span class="ranking">排名：{{i+1}}</span>' +
    '				            	<span class="votes">{{data.scores[i]}}票</span>' +
    '				            </div>' +
    '				        </div>' +
    '				    </li>' +
    '{{/each}}');
voteTpl.search = template.compile(
    '<ul class="ui-justify  voteListCon  mt20">' +
'   {{each data.items as val1 i}}' +
'	<li class="ui-col-30">' +
'	  <div class="production voteBtnItem {{val1.cover | hasImg}} {{val1.type | voteType}} " voteId = "{{val1.id}}" voteType="{{val1.type}}" style="background-image:url({{val1.cover}});">'+coverItem+' </div>' +
'	  <p class="productionTitle">{{val1.code}}号: {{val1.name}}</p>' +
    '						    	<p class="voteNumWrap">票数<span class="voteNum" id="vote1_{{val1.id}}">{{if data.scores[val1.id] > 0}}{{data.scores[val1.id]}}{{else}}0{{/if}}</span></p>' +
    '{{if val1.type == 4}}' +
    '						    	 <a  href="{{val1.src}}">选择</a>' +
    '{{else}}' +
    '                               <a  href="javascript:;" class="selectBtn" voteId = "{{val1.id}}" voteType="{{val1.type}}">选择</a>' +
    '{{/if}}' +
'   </li>' +
'  {{/each}}' +
'  {{if data.length % 3 == 1 }}' +
'  <li class="ui-col-30"></li>' +
'  {{else if data.length % 3 == 2 }}' +
'  <li class="ui-col-30"></li>' +
'  <li class="ui-col-30"></li>' +
'  {{/if}}' +
'</ul>');


voteTpl.items1 = template.compile(
    '<div class="main" style="background-image:url({{data.commonData.background_img}});">' +
    // '		<div class="ui-whitespace header">' +
    // '			<h1 class="center ">{{data.commonData.title}}</h1>' +
    // '		</div>' +
    '		<div class="detailCon pb30">' +
    '			<div class="ui-whitespace">' +
    '			    <h2>{{data.data.item.name}}</h2>' +
    '				<div id="voteContent" class="mt10">{{#data.data.item.content}}</div>' +
    '{{if data.data.item.from!=2}}'+
    '			    <img src="{{data.data.item.cover}}" alt="">' +
    '{{/if}}'+
    '				<div class="productionStates mt20">' +
    '					<div>' +
    '						<p id="vote_{{data.data.item.id}}">{{if data.data.votes > 0}}{{data.data.votes}}{{else}}0{{/if}}票</p>' +
    '						<p>票数</p>' +
    '					</div>' +
    '					<div>' +
    '						<p id="vote_num_{{data.data.item.id}}">{{data.data.rank||0}}</p>' +
    '						<p>排名</p>' +
    '					</div>' +
    '				</div>' +
    // '				<button class="productionBtn mt20 inlayer voteBtn" voteId = "{{data.data.item.id}}">投票</button>' +
    '				<button class="productionBtn mt10 closeItem">返回</button>' +
    '			</div>' +
    '		</div>' +
    '	</div>');
voteTpl.items2 = template.compile(
    '<div class="main" style="background-image:url({{data.commonData.background_img}});">' +
    // '		<div class="ui-whitespace header">' +
    // '			<h1 class="center ">{{data.commonData.title}}</h1>' +
    // '		</div>' +
    '		<div class="detailCon pb30">' +
    '			<div class="ui-whitespace">' +
    '			    <h2>{{data.data.item.name}}</h2>' +
    '				<div id="voteContent" class="mt10">{{#data.data.item.content}}</div>' +
    '               {{if data.data.item.from!=2}}'+
    '			      <audio  controls src="{{data.data.item.src}}">' +
    '				    您的浏览器不能使用最新的视频播放方式呢' +
    '			      </audio>' +
    '               {{/if}}'+
    '				<div class="productionStates mt20">' +
    '					<div>' +
    '						<p id="vote_{{data.data.item.id}}">{{if data.data.votes > 0}}{{data.data.votes}}{{else}}0{{/if}}票</p>' +
    '						<p>票数</p>' +
    '					</div>' +
    '					<div>' +
    '						<p id="vote_num_{{data.data.item.id}}">{{data.data.rank||0}}</p>' +
    '						<p>排名</p>' +
    '					</div>' +
    '				</div>' +
    // '				<a class="productionBtn mt20 inlayer voteBtn" voteId = "{{data.data.item.id}}">投票</a>' +
    '				<button class="productionBtn mt10 closeItem">返回</button>' +
    '			</div>' +
    '		</div>' +
    '	</div>');

voteTpl.items3 = template.compile(
    '<div class="main" style="background-image:url({{data.commonData.background_img}});">' +
    // '		<div class="ui-whitespace header">' +
    // '			<h1 class="center ">{{data.commonData.title}}</h1>' +
    // '		</div>' +
    '		<div class="detailCon pb30">' +
    '			<div class="ui-whitespace">' +
    '			    <h2>{{data.data.item.name}}</h2>' +
    '				<div id="voteContent" class="mt10">{{#data.data.item.content}}</div>' +
    '               {{if data.data.item.from!=2}}'+
   // '		        <video controls poster="{{data.data.item.cover}}">' +
    //'				    <source src="{{data.data.item.src}}" type="video/mp4">' +
   // '				    您的浏览器不能使用最新的视频播放方式呢' +
   // '			    </video>' +
    '               <div id="dplayer" class="video-propotion"></div>'+
    '               {{/if}}'+
    '				<div class="productionStates mt20">' +
    '					<div>' +
    '						<p id="vote_{{data.data.item.id}}">{{if data.data.votes > 0}}{{data.data.votes}}{{else}}0{{/if}}票</p>' +
    '						<p>票数</p>' +
    '					</div>' +
    '					<div>' +
    '						<p id="vote_num_{{data.data.item.id}}">{{data.data.rank||0}}</p>' +
    '						<p>排名</p>' +
    '					</div>' +
    '				</div>' +
    // '				<a class="productionBtn mt20 voteBtn inlayer" voteId = "{{data.data.item.id}}">投票</a>' +
    '				<button class="productionBtn mt10 closeItem">返回</button>' +
    '			</div>' +
    '		</div>' +
    '	</div>');

voteTpl.items4 = template.compile(
    '<div id="main" style="background-image:url(\'img/wen.png\');">' +
    '		<div class="ui-whitespace header">' +
    '			<h1 class="center ">“绿地泉”杯4</h1>' +
    '			<h2 class="center">济南市第二届公益广告大赛</h2>' +
    '		</div>' +
    '		<div class="detailCon mt20 pb30">' +
    '			<img src="img/demo1.PNG" alt="">' +
    '			<div class="ui-whitespace">' +
    '				<h2 class="mt20">765号作品 “绿地泉</h2>' +
    '				<p class="mt20">排白杨树像是换了金黄秋装的战士，挺拔的站成一道风景线。夕阳照 在白杨树上，给萧瑟的民大秋天增添了不少暖意。</p>' +
    '				<div class="productionStates mt20">' +
    '					<div>' +
    '						<p>88888票</p>' +
    '						<p>票数</p>' +
    '					</div>' +
    '					<div>' +
    '						<p id="rank-num">123</p>' +
    '						<p>排名</p>' +
    '					</div>' +
    '				</div>' +
    '				<a class="productionBtn mt20 voteBtn inlayer" voteId = "{{data.item.id}}">投票</a>' +
    '			</div>' +
    '		</div>' +
    '	</div>');


template.helper('urlFormat', function(url) {
    return encodeURI(url);
});

//是否有背景图,有无背景图显示不一样图标
template.helper('hasImg', function(url) {
    return url ? 'hasImg' : '';
});

//是否有背景图,有无背景图显示不一样图标
template.helper('len', function(url) {
    return url.length;
});

//处理投票类型
//不同类型显示不同图标
template.helper('voteType', function(type) {
    var voteType;
    if (type == 1) { //图片
        voteType = 'picCon'
    } else if (type == 2) { //
        voteType = 'audioCon'
    } else if (type == 3) {
        voteType = 'videoCon'
    } else if (type == 4) {
        voteType = ''
    }
    return voteType
});
